<template>
  <el-dialog :title="type === 'insert' ? '新增分类标签' : '修改分类标签'" :visible.sync='visible' width='600px'
             @closed='closeDialog'>
    <el-row v-if="tag.level > 1 && type === 'insert'">
      <el-col :span='7'>
        <span class='label'>上级分类名称<em style='color: red'>*</em></span>
      </el-col>
      <el-col :span='17'>
        <el-input v-model="tag.parentName" disabled/>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span='7'>
        <span class='label'>分类标签名称<em style='color: red'>*</em></span>
      </el-col>
      <el-col :span='17'>
        <el-input v-model="tag.name" placeholder="请输入分类名称"/>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span='7'>
        <span class='label'>级别<em style='color: red'>*</em></span>
      </el-col>
      <el-col :span='17'>
        <el-input v-model="tag.level" disabled/>
      </el-col>
    </el-row>

    <div slot="footer" class="dialog-footer">
      <el-button @click='visible = false'>取 消</el-button>
      <el-button type="primary" @click="submit">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'InsertTagDialog',
  data() {
    return {
      type: '',
      visible: false,
      tag: {
        name: ''
      },
      siblingTagList: []
    }
  },
  methods: {
    submit() {
      // 校验;
      if (UTIL.isEmpty(this.tag.name)) {
        this.$message.warning("标签名称不能为空")
        return
      }
      for (let siblingTag of this.siblingTagList) {
        if (siblingTag.name === this.tag.name && siblingTag.id !== this.tag.id) {
          this.$message.warning("标签名称和兄弟节点重复")
          return
        }
      }
      this.axios.post('/pmph/action/examOutline/saveTag', this.tag).then(() => {
        this.$emit('saveTag')
      })
      this.visible = false
    },
    closeDialog() {
      this.visible = false
      this.tag.id = ''
      this.tag.sort = null
      this.tag.level = null
      this.tag.name = ''
      this.tag.parentId = ''
      this.tag.examOutlineId = ''
    }
  },
}
</script>

<style scoped>
.el-row {
  line-height: 50px;
}

.el-col {
  display: inline-block;
}

/deep/ .el-dialog__body {
  padding: 0px 20px;
}
</style>
